<template>
  <div style="height:100%;width:100%;position:relative;overflow: hidden;">
      <div class="page-top" style="border:1px solid #CCC">
          <div class="search-title">快速查询</div>
          <el-input v-model="searchParam" placeholder="请输入组合代码、组合名称、录入码" @keyup.enter.native="filterData" clearable :disabled="changeflag" style="width: 260px;"></el-input>
          <div class="top-deal">
              <el-button icon="el-icon-search" type="primary" @click="filterData" :disabled="changeflag">查询</el-button>
              <el-button icon="el-icon-plus" @click="MainOpenDialog(1)" :disabled="changeflag">新增</el-button>
              <el-button icon="el-icon-delete" @click="MainOpenDialog(2)" :disabled="changeflag">删除</el-button>
              <el-button icon="el-icon-document" @click="MainOpenDialog(3)" :disabled="!changeflag">保存</el-button>
              <el-button icon="el-icon-close" @click="MainOpenDialog(4)" :disabled="!changeflag">取消</el-button>
              <el-button icon="el-icon-files" @click="ImportCsv" ref="importFile" :disabled="changeflag">导入</el-button>
              <div class="upload-button">
                  <el-upload ref="upload" 
                      :action="url" accept=".dat" 
                      :before-upload="beforeUploadFile" :on-change="fileChange" :show-file-list="showFile"
                      :data="updata" :http-request="uploadOpt">
                      <el-button size="small" plain>选择文件</el-button>
                      <!-- <div slot="tip" class="el-upload__tip">只能上传DAT(*dat)文件，且不超过10M</div> -->
                  </el-upload>
              </div>
              <el-button icon="el-icon-upload2" @click="ExportCsv" style="margin-left: 10px" :disabled="changeflag">导出</el-button>
          </div>
      </div>
      <div class="pagecenter">
          <rm-layout-right splitcolor="#FFFFFF" movingcolor="#CCFFFF" :splitwidth=5 :fixsize=496>
              <div class="pagecenter-left">
                  <vxe-table show-overflow ref="xTable" :data.sync="backMediumGroupList" class="mytable-style" height="auto" 
                      :loading="backMediumGroupLoading" :sort-config="{trigger: 'cell'}" :keyboard-local-config="keyLocalConfig" 
                      border size="mini" show-header-overflow highlight-current-row resizable stripe header-align="center" 
                      :row-class-name="rowClassName" @current-change="currentChangeEvent">
                      <vxe-table-column type="index" title=" " width="40" align="center"></vxe-table-column>
                      <vxe-table-column field="pureflag" title="组合类别" :formatter="format" width="60" align="center"></vxe-table-column>
                      <vxe-table-column field="mediumgroupno" title="组合代码" width="90"></vxe-table-column>
                      <vxe-table-column field="mediumgroupname" title="组合名称" width="140"></vxe-table-column>
                      <vxe-table-column field="comments" title="备注" width="200"></vxe-table-column>
                      <vxe-table-column field="inputcode" title="录入码" width="100"></vxe-table-column>
                      <vxe-table-column field="seq" title="序号" width="40" align="center"></vxe-table-column>
                      <vxe-table-column field="labelcopy" title="标签份数" width="60" align="center"></vxe-table-column>
                  </vxe-table>
              </div>
              <template v-slot:fix>
                  <rm-layout-top splitcolor="#ffffff" :splitwidth=5 :fixsize=218>
                      <template v-slot:fix>
                          <div class="pagecenter-right-top">
                              <table>
                                  <tr>
                                      <td width="80" align="right" class="must-param">组合代码</td>
                                      <td colspan="3"><el-input v-model="addParam.mediumgroupno" :disabled="operatetype != 1" placeholder="" @input="hasChange" ref="input11" @keyup.enter.native="nextFocus(1, 1)"></el-input></td>
                                  </tr>
                                  <tr>
                                      <td width="80" align="right" class="must-param">组合名称</td>
                                      <td colspan="4"><el-input v-model="addParam.mediumgroupname" placeholder="" @input="hasChange" @change.native="createInputcode" ref="input12" @keyup.enter.native="nextFocus(1, 2)"></el-input></td>
                                  </tr>
                                  <tr>
                                      <td width="80" align="right" style="vertical-align:top">备注</td>
                                      <td colspan="4"><el-input type="textarea" v-model="addParam.comments" rows="3" @input="hasChange" ref="input13" @keyup.enter.native="nextFocus(1, 3)"></el-input></td>
                                  </tr>
                                  <tr>
                                      <td width="80" align="right">组合类别</td>
                                      <td colspan="4">
                                          <el-radio-group v-model="addParam.pureflag" @change="hasChange" size="mini">
                                              <el-radio label="0">普通</el-radio>
                                              <el-radio label="1">纯分</el-radio>
                                              <el-radio label="2">转种</el-radio>
                                          </el-radio-group>
                                          <!-- <rm-ddl-common datatype="userinfo" dataname="用户" v-model="addParam.createuser" width="100px" :disabled="utype!='G'" ref="input13" @keyup.enter.native="nextFocus(1, 3)" @change="createuserChange"></rm-ddl-common> -->
                                      </td>
                                  </tr>
                                  <tr>
                                      <td width="80" align="right">录入码</td>
                                      <td>
                                          <el-input v-model="addParam.inputcode" maxlength="20" @input="hasChange" ref="input14" @keyup.enter.native="nextFocus(1, 4)"></el-input>
                                      </td>
                                      <td width="40"></td>
                                      <td width="80" align="right">序号</td>
                                      <td>
                                          <el-input v-model="addParam.seq" @input="hasChange" ref="input15" @keyup.enter.native="nextFocus(1, 5)"></el-input>
                                      </td>
                                  </tr>
                                  <tr>
                                      <td width="80" align="right">标签份数</td>
                                      <td>
                                          <el-input v-model="addParam.labelcopy" @input="hasChange" ref="input16" @keyup.enter.native="nextFocus(1, 6)"></el-input>
                                      </td>
                                      <td colspan="3">（0表示按照实际培养基数量打印）</td>
                                  </tr>
                              </table>
                          </div>
                      </template>
                      <div style="height: calc(100% - 36px)">
                          <vxe-table show-overflow ref="xTable2" :data.sync="backMediumGroupDetList" :loading="backMediumGroupDetLoading" 
                              height="auto" width="100%" border size="mini" :keyboard-local-config="keyLocalConfig" :mouse-config="{ selected: true }" 
                              show-header-overflow highlight-current-row highlight-hover-row resizable stripe 
                              :edit-config="{ trigger: 'click', mode: 'cell', showStatus: true, showIcon: false }">
                              <vxe-table-column  field="mediumgroupno" title=" " width="100px" header-align="center"></vxe-table-column>
                              <vxe-table-column field="mediumno" title="培养基" width="160px" header-align="center">
                                  <template v-slot="{ row }">
                                      <el-select v-model="row.mediumno" filterable placeholder="请选择" @dblclick.native="CellDblclick(row)" @change="hasChange">
                                          <el-option v-for="item in bactmediumList" :key="item.mediumno" :label="item.mediumname" :value="item.mediumno"></el-option>
                                      </el-select>
                                      <!-- <rm-ddl-common datatype="bactmedium" dataname="培养基" v-model="row.mediumno" @change="hasChange"></rm-ddl-common> -->
                                  </template>
                              </vxe-table-column>
                              <vxe-table-column field="seq" title="序号" :edit-render="{name:'input', events: {change: hasChange}}" width="80" align="center"></vxe-table-column>
                              <vxe-table-column field="defmedium" title="初鉴结果默认" width="100" align="center">
                                  <template v-slot="{row}">
                                      <el-checkbox v-model="row.defmedium" true-label='1' false-label="0" @change="hasChange"></el-checkbox>
                                  </template>
                              </vxe-table-column>
                          </vxe-table>
                          <div class="detail-operation">
                              <el-button icon="el-icon-plus" class="el-button--310" @click="MainOpenDialog(5)">新增明细</el-button>
                              <el-button icon="el-icon-caret-top" class="el-button--310" @click="MainOpenDialog(6)">插入明细</el-button>
                              <el-button icon="el-icon-delete" class="el-button--310" @click="MainOpenDialog(7)">删除明细</el-button>
                          </div>
                      </div>
                  </rm-layout-top>
              </template>
          </rm-layout-right>
      </div>
      
      <el-dialog width="1000px" top="10px" :append-to-body="true" :close-on-click-modal="false" title="选择报告项目" :visible.sync="dialogTableVisible" :destroy-on-close="true">
          <rm-pop-common @change="popcomchange" @cancel="dialogTableVisible=false;" :multiple="false" datatype="bactmedium"></rm-pop-common>
      </el-dialog>
  </div>
</template>

<script>
import XEUtils from "xe-utils";
import axios from "axios";
export default {
  name: "LIS834",
  data() {
      return {
          backMediumGroupLoading: false,
          backMediumGroupList: [],
          fbackMediumGroupList: [],
          backMediumGroupDetLoading: false,
          backMediumGroupDetList: [],
          coverflag: false,
          backMediumGroupDetList: [],
          fbackMediumGroupDetList: [],
          keyLocalConfig: {
              isArrow: true
          },
          searchParam: '',
          addParam: {}, // 新增 修改 字段
          faddParam: {},
          operatetype: 2, //1:新增 2:修改 3:删除
          changeflag: false,
          selrow: {},
          txtoperatorOptions: [
              {
                  value: 'In',
                  label: '等于'
              }, {
                  value: 'NotIn',
                  label: '不等于'
              }
          ],
          allMediumgroupnoList: [],
          form: {},
          isoverride: 0,
          showFile: false,
          url: '',
          updata: {action: 'LIS834', isoverride: 0},
          dialogTableVisible: false,
          bactmediumList: []
      };
  },
  created() {
      this.queryBactmediumList();
      this.QueryGroupSearch();
      this.url = this.$tool.baseUrl.replace(/api/, "z") + "fileupload"
  },
  mounted() {},
  methods: {
      queryBactmediumList() {
          this.$tool
              .request({
                  url: "LIS/LIS8/LIS834",
                  method: "post",
                  data: {
                      action: "bactmedium"
                  }
              })
              .then(response => {
                  this.bactmediumList = response.Data;
              })
              .catch(e => {
                  console.log("error", e);
              });
      },
      //查询条件
      QueryGroupSearch() {
          this.backMediumGroupLoading = true;
          this.$tool
              .request({
                  url: "LIS/LIS8/LIS834",
                  method: "post",
                  data: {
                      action: "querylist"
                  }
              })
              .then(response => {
                  this.backMediumGroupLoading = false;
                  if( response.length > 0) {
                      var mediumgroupnoList = [];
                      response.forEach(element => {
                          mediumgroupnoList.push(element.mediumgroupno);
                          element.updateflag = 0;
                      });
                      this.fbackMediumGroupList = XEUtils.clone(response, true);
                      this.backMediumGroupList = response;
                      // this.faddParam = XEUtils.clone(response[0], true);
                      // this.addParam = XEUtils.clone(response[0], true);
                      this.allMediumgroupnoList = mediumgroupnoList;
                      this.selrow = response[0];
                      this.$refs.xTable.setCurrentRow(this.selrow);
                      this.QueryBackMediumGroupDetList(this.selrow.mediumgroupno);
                  } else {
                      this.fbackMediumGroupList = [];
                      this.backMediumGroupList = [];
                  }
              })
              .catch(e => {
                  console.log("error", e);
              });
      },
      // 查询培养基
      QueryBackMediumGroupDetList(mediumgroupno) {
          this.backMediumGroupDetLoading = true;
          this.$tool
              .request({
                  url: "LIS/LIS8/LIS834",
                  method: "post",
                  data: {
                      action: "querydetail",
                      mediumgroupno: mediumgroupno
                  }
              })
              .then(response => {
                  this.backMediumGroupDetLoading = false;
                  this.faddParam = XEUtils.clone(response.group, true);
                  this.addParam = response.group;
                  this.fbackMediumGroupDetList = XEUtils.clone(response.details, true);
                  this.backMediumGroupDetList = response.details;
                  if (response.details.length > 0) {
                      this.$refs.xTable2.setCurrentRow(response.details[0]);
                  }
              })
              .catch(e => { });
      },
      filterData() {
          let filterName = this.searchParam.trim();
          let queryList = [];
          if (filterName) {
              queryList = this.fbackMediumGroupList.filter(item => item.mediumgroupno.toUpperCase().indexOf(filterName.toUpperCase()) > -1 || item.mediumgroupname.toUpperCase().indexOf(filterName.toUpperCase()) > -1 || item.inputcode.toUpperCase().indexOf(filterName.toUpperCase()) > -1);
              this.backMediumGroupList = queryList;
              if (queryList.length > 0) {
                  this.$refs.xTable.setCurrentRow(queryList[0]);
                  this.QueryBackMediumGroupDetList(queryList[0].mediumgroupno);
                  this.selrow = this.$refs.xTable.getCurrentRow();
              } else {
                  this.addParam = [];
                  this.mediumResultList = [];
                  this.mediumSpecList = [];
              }
          } else {
              this.backMediumGroupList = XEUtils.clone(this.fbackMediumGroupList, true);
              if (this.backMediumGroupList.length > 0) {
                  this.$refs.xTable.setCurrentRow(this.backMediumGroupList[0]);
                  this.QueryBackMediumGroupDetList(this.backMediumGroupList[0].mediumgroupno);
                  this.selrow = this.$refs.xTable.getCurrentRow();
              }
          }
      },
      currentChangeEvent(e) {
          if (this.changeflag) {
              // 点击切换之前的 row
              this.$refs.xTable.setCurrentRow(this.selrow);
              return false;
          }
          this.selrow = e.row;
          this.faddParam = XEUtils.clone(e.row, true);
          // this.addParam = e.row;
          this.addParam = XEUtils.clone(e.row, true);
          // var rowIndex = e.rowIndex;
          this.QueryBackMediumGroupDetList(this.selrow.mediumgroupno);
      },
      MainOpenDialog(type) {
          if (type == 1) { // 新增
              this.operatetype = 1;
              this.hasChange();
              this.addParam = {
                  pureflag: ''
              };
              this.backMediumGroupDetList = [];
              setTimeout(() => {
                  this.$refs.input11.$refs.input.focus();
              }, 100);
          }
          if (type == 2) { // 删除
              var that = this;
              that.$confirm('你确定删除这条记录?', '提示', {
                  confirmButtonText: '确定',
                  cancelButtonText: '取消',
                  type: 'warning'
              }).then(() => {
                  that.operatetype = 3;
                  that.$tool
                      .request({
                          url: "LIS/LIS8/LIS834",
                          method: "post",
                          data: {
                              action: "savedata",
                              mediumgroupno: this.addParam.mediumgroupno,
                              mediumgroup: this.addParam,
                              utype: this.operatetype
                          }
                      })
                      .then(response => {
                          if (response.errcode != "1") {
                              that.$message({
                                  message: "保存失败！" + response.errmsg,
                                  type: "warning"
                              });
                          } else {
                              that.$message({
                                  message: "删除成功！",
                                  type: "success"
                              });
                              // that.QueryGroupSearch();
                              that.changeflag = false;
                              that.operatetype = 2;
                              // 删除不刷新表格
                              var delrow = this.$refs.xTable.getCurrentRow();
                              var rowindex = this.$refs.xTable.getTableData().fullData.indexOf(delrow);
                              this.backMediumGroupList.splice(rowindex, 1);
                              this.$refs.xTable.loadData(this.backMediumGroupList).then(()=>{
                                  var havedata = this.$refs.xTable.getTableData().fullData;
                                  if (havedata.length > 0) {
                                      if (rowindex >= havedata.length) rowindex = havedata.length - 1;
                                      this.fbackMediumGroupList = XEUtils.clone(havedata, true);
                                      this.faddParam = XEUtils.clone(havedata[rowindex], true);
                                      this.addParam = XEUtils.clone(havedata[rowindex], true);
                                      let selectrow = havedata[rowindex];
                                      this.$refs.xTable.setCurrentRow(selectrow);
                                      this.selrow = this.$refs.xTable.getCurrentRow();
                                      this.QueryBackMediumGroupDetList(selectrow.mediumgroupno);
                                  }
                              });
                              if (this.allMediumgroupnoList.indexOf(delrow.mediumgroupno) != -1) {
                                  this.allMediumgroupnoList.splice(this.allMediumgroupnoList.indexOf(delrow.mediumgroupno), 1);
                              }
                              this.fbackMediumGroupList = XEUtils.clone(havedata, true);
                              console.log(this.fbackMediumGroupList)
                          }
                      })
                      .catch(e => {});
              });
          }
          if (type == 3) { // 保存
              this.saveAllData();
          }
          if (type == 4) { // 取消
              this.$confirm("确定取消当前修改?", "提示", {
                  confirmButtonText: "确定",
                  cancelButtonText: "取消",
                  type: "warning"
              }).then(() => {
                  if (this.operatetype == 1) {
                      this.backMediumGroupDetList = [];
                  } else {
                      this.QueryBackMediumGroupDetList(this.selrow.mediumgroupno);
                  }
                  this.operatetype = 2;
                  this.changeflag = false;
                  this.addParam = XEUtils.clone(this.faddParam, true);
                  this.$nextTick(() => {
                      this.$refs.xTable.setCurrentRow(this.selrow);
                  });
              });
          }
          if (type == 5) {
              this.$refs.xTable2.insert({
                  mediumgroupno: this.addParam.mediumgroupno,
                  seq: this.$refs.xTable2.tableFullData.length > 0 ? (Math.floor(this.$refs.xTable2.tableFullData[this.$refs.xTable2.tableFullData.length - 1].seq/10) + 1) * 10 : 10,
              }).then(({ row }) => {
                  this.$nextTick(() => {
                      this.$refs.xTable2.setCurrentRow(row);
                  });
              });
              this.hasChange();
          }
          if (type == 6) {
              this.mediumDetailTableInsert();
          }
          if (type == 7) {
              this.mediumDetailTableDelete();
          }
      },
      saveAllData() {
          var that = this;
          if (that.addParam.mediumgroupno == undefined || that.addParam.mediumgroupno == '') {
              that.$alert('请输入组合代码', '信息', {
                  confirmButtonText: '确定',
                  callback: action => {}
              });
              return false;
          }
          if (that.addParam.mediumgroupname == undefined || that.addParam.mediumgroupname == '') {
              that.$alert('请输入组合名称', '信息', {
                  confirmButtonText: '确定',
                  callback: action => {}
              });
              return false;
          }
          if (that.operatetype == 1 && that.allMediumgroupnoList.indexOf(that.addParam.mediumgroupno) != -1) {
              that.$message({
                  message: "组合代码冲突",
                  type: "warning"
              });
              return false;
          }
          // 排序
          that.$refs.xTable2.tableFullData.sort((a, b) => {
              return a.seq - b.seq;
          });
          that.$refs.xTable2.tableFullData.forEach((element, index) => {
              element.mediumgroupno = that.addParam.mediumgroupno;
              element.seq = (index + 1) * 10;
          });
          // 保存
          that.$tool
              .request({
                  url: "LIS/LIS8/LIS834",
                  method: "post",
                  data: {
                      action: "savedata",
                      mediumgroupno: that.addParam.mediumgroupno,
                      mediumgroup: that.addParam,
                      mediumgroupdet: that.$refs.xTable2.tableFullData,
                      utype: that.operatetype
                  }
              })
              .then(response => {
                  if (response.errcode != "1") {
                      that.$message({
                          message: "保存失败！" + response.errmsg,
                          type: "warning"
                      });
                  } else {
                      that.$message({
                          message: "保存成功！",
                          type: "success"
                      });
                      // this.queryMediumDetail(this.addParam.mediumno);
                      that.changeflag = false;
                      if (that.operatetype == 1) {
                          that.operatetype = 2;
                          that.$tool
                              .request({
                                  url: "LIS/LIS8/LIS834",
                                  method: "post",
                                  data: {
                                      action: "querydetail",
                                      mediumgroupno: that.addParam.mediumgroupno
                                  }
                              })
                              .then(response => {
                                  that.mediumResultLoading = false;
                                  response.group.updateflag = 2;
                                  that.faddParam = XEUtils.clone(response.group, true);
                                  that.addParam = response.group;
                                  that.mediumResultList = response.mediumresult;
                                  that.mediumSpecList = response.mediumspec;
                                  // 新增不更新表格操作
                                  that.fbackMediumGroupList.push(response.group);
                                  that.backMediumGroupList.push(response.group);
                                  that.$refs.xTable.loadData(that.backMediumGroupList).then(()=>{
                                      var lastrow = that.$refs.xTable.tableFullData[that.$refs.xTable.tableFullData.length-1];
                                      that.$refs.xTable.setCurrentRow(lastrow).then(()=>{
                                          that.selrow = that.$refs.xTable.getCurrentRow();
                                      });
                                      
                                  });
                                      
                                  that.allMediumgroupnoList.push(that.addParam.mediumgroupno);
                              })
                              .catch(e => { });
                          return false;
                      }
                      if(that.operatetype == 2) {
                          // that.QueryBackMediumGroupDetList(that.addParam.mediumgroupno);
                          var fcurmedium = that.fbackMediumGroupList.filter( t => t.mediumgroupno == that.selrow.mediumgroupno)
                          that.addParam.updateflag = 1;
                          Object.keys(that.addParam).forEach(key => {
                              if (that.selrow.hasOwnProperty(key)) {
                                  that.selrow[key] = that.addParam[key];
                                  fcurmedium[0][key] = that.addParam[key];
                              } 
                          })
                          that.faddParam = XEUtils.clone(that.addParam, true);
                      }
                  }
              })
              .catch(e => {});

      },

      mediumDetailTableInsert() {
          var newRow = {
              mediumgroupno: this.addParam.mediumgroupno,
              seq: this.$refs.xTable2.tableFullData.length > 0 ? (Math.floor(this.$refs.xTable2.tableFullData[this.$refs.xTable2.tableFullData.length - 1].seq/10) + 1) * 10 : 10,
          }
          var row = this.$refs.xTable2.getCurrentRow();
          var havedata = this.$refs.xTable2.getTableData().fullData;
          if (row && havedata.length > 0) {
              newRow.seq = (row.seq/10 - 1)*10;
              this.$refs.xTable2.insertAt(newRow,row).then(({ row }) => {
                  this.$nextTick(() => {
                      this.$refs.xTable2.setCurrentRow(row);
                  });
              });
          } else {
              this.$refs.xTable2.insert(newRow).then(({ row }) => {
                  this.$nextTick(() => {
                      this.$refs.xTable2.setCurrentRow(row);
                  });
              });
          }
      },
      mediumDetailTableDelete() {
          var delrow = this.$refs.xTable2.getCurrentRow();
          var havedata = this.$refs.xTable2.getTableData().fullData;
          if (delrow && havedata.length > 0) {
              var rowindex = havedata.indexOf(delrow);
              this.$refs.xTable2.remove(delrow);
              if (havedata.length > 0) {
                  if (rowindex == 0) {
                      this.$refs.xTable2.setCurrentRow(this.$refs.xTable2.getTableData().fullData[0]);
                      return false;
                  }
                  if (rowindex >= havedata.length) {
                      rowindex = havedata.length - 1;
                  }
                  let selectrow = havedata[rowindex - 1];
                  this.$refs.xTable2.setCurrentRow(selectrow);
              }

              this.hasChange();
          } else {
              this.$message({
                  message: "请先选中要删除的明细！",
                  type: "warning"
              });
          }
      },
      CellDblclick(row) {
          this.detailrow = row;
          this.dialogTableVisible = true;
          // this.changeflag = true;
      },
      popcomchange(c, v) {
          this.detailrow.mediumno = c;
          this.detailrow.mediumname = v;
          this.dialogTableVisible = false;
      },
      hasChange(type){
          this.changeflag = true;
      },
      createInputcode() {
          this.addParam.inputcode = this.$pub.CreateInputcode(this.addParam.mediumgroupname, this).substring(0, 20);
      },
      rowClassName({ row, rowIndex }) {
          if(row.updateflag == 1){
              return "row-modify row--current";
          }
          if(row.updateflag == 2){
              console.log("row-new row--current")
              return "row-new row--current";
          }
      },
      format({ cellValue, row, column }) {
          if (column.property == "pureflag") {
              if (row.pureflag == "0") {
                  return "普通";
              } else if (row.pureflag == "1") {
                  return "纯分";
              } else if (row.pureflag == "2") {
                  return "转种"; 
              } else {
                  return cellValue;
              }
          } else {
              return cellValue;
          }
      },
      // 回车切换输入框
      nextFocus(id, index) {
          if (index <= 5) {
              var that = this;
              var focusIndex = index + 1;
              setTimeout(function () {
                  // if (index == 3) {
                  //     that.$refs['input' + id + index].$refs.ddlmainSelect.blur();
                  // }
                  that.$refs['input' + id + focusIndex].focus()
              }, 1)
          }
      },
      ExportCsv() {
          let p = { prgno: "LIS834" };
          this.$pub.commexport(this, p, `培养基组合.dat`);
      },
      ImportCsv() {
          this.$confirm('是否覆盖重复数据?', '提示', {
              confirmButtonText: '覆盖',
              cancelButtonText: '不覆盖',
              type: 'warning'
          }).then(() => {
              this.updata.isoverride = 1;
              this.$refs['upload'].$refs['upload-inner'].handleClick()
          }).catch(() => {
              this.updata.isoverride = 0;
              this.$refs['upload'].$refs['upload-inner'].handleClick()
          });
      },
      // 文件状态改变时的钩子
      fileChange(file, fileList) {
          this.form.file = file.raw;
      },
      // 上传文件之前的钩子, 参数为上传的文件,若返回 false 或者返回 Promise 且被 reject，则停止上传
      beforeUploadFile(file) {
          let extension = file.name.substring(file.name.lastIndexOf(".") + 1);
          let size = file.size / 1024 / 1024;
          if (extension !== "dat") {
              this.$notify.warning({
                  title: "警告",
                  message: `只能上传DAT(*dat)文件，且不超过10M`
              });
          }
          if (size > 10) {
              this.$notify.warning({
                  title: "警告",
                  message: `文件大小不得超过10M`
              });
          }
      },
      uploadOpt(content) {
          let formData = new FormData()
          formData.append('action', 'LIS834');
          formData.append('file', content.file);
          this.$pub.uploadFileOpt(this, formData, "QueryGroupSearch");
      },
  }
};
</script>

<style scoped>
.page-top {
  width: 100%;
  height: 38px;
  border: 1px solid #ccc;
  position: absolute;
  font-size: 12px;
  display: flex;
  padding: 5px 0;
  line-height: 24px;
}
.page-top .top-table {
  float: right;
}
.search-title {
  margin: 0 5px 0 20px;
}
.top-deal {
  right: 5px;
  position: absolute;
  height: 25px;
  display: flex;
  align-items: center;
}
.upload-button {
  height: 24px;
  margin: 0 10px;
  display: none;
}
.upload-button div{
  height: 24px;
}
.pagecenter {
  position: absolute;
  top: 43px;
  width: 100%;
  left: 0;
  bottom: 0px;
  overflow: auto;
}
.pagecenter-left {
  height: 100%;
}
.pagecenter-right-top {
  width: 100%;
  border: 1px solid #ccc;
}
.pagecenter-right-top table {
  font-size: 12px;
  width: 100%;
  border-spacing: 5px;
}
.detail-operation {
  display: flex;
  padding: 0px 2px 0px 5px;
  margin: 5px 0;
}
/* /deep/.middle-center tr td div .el-input__inner {
  border: 1px solid rgba(255, 254, 254, 0) !important;
  background-color: rgba(255, 254, 254, 0) !important;
} */
/* /deep/ .el-input.is-disabled .el-input__inner {
  color: #000000 !important;
} */
/deep/ .el-button.is-disabled{
  border:0px;
  color:grey;
  background-color:#e6e6e6;
  font-weight:normal;
}
/deep/ .el-textarea__inner {
  padding: 2px 5px !important;
}
/deep/ .search-textarea .el-textarea__inner {
  width: 100% !important;
}
/deep/ .el-button.is-disabled{
  border:0px;
  color:grey;
  background-color:#e6e6e6;
  font-weight:normal;
}
/deep/ .pagecenter-left tr.vxe-body--row.row-new {
  color: #cc6600;
}
/deep/ .pagecenter-left tr.vxe-body--row.row-modify {
  color: blue !important;
}
</style>
